<template>

  <div style="display: flex; flex-direction: column; align-items: center;">
    <el-table :data="tableData" >

      <el-table-column prop="userId" label="用户Id">
      </el-table-column>
      <el-table-column prop="userName" label="用户名">
      </el-table-column>
      <el-table-column v-if="limit === 'student' || limit === 'class'" prop="classId" label="班级">
      </el-table-column>
      <el-table-column prop="courseId" label="课程Id">
      </el-table-column>
      <el-table-column prop="courseName" label="课程名">
      </el-table-column>
      <el-table-column prop="textbookId" label="教材Id">
      </el-table-column>
      <el-table-column label="领取">
        <template v-slot="scope">
          <span v-if="scope.row.canGet === 0">无法领取</span>
          <el-button v-else type="primary" @click="ReceiveText(scope.row)">领取</el-button>
        </template>
      </el-table-column>
      <el-table-column v-if="limit === 'teacher'" prop="textbookNum" label="教材数目">
        <template v-slot="scope">
          <el-input v-model="scope.row.textbookNum" @input="handleNumberInput('scope.row.textbookNum')" placeholder="默认为1">
          </el-input>
        </template>
      </el-table-column>
    </el-table>



    <el-pagination
        :page-size="pageSize"
        :pager-count="pageNum"
        :total="totalCount"
        layout="total, prev, pager, next, jumper"
        @current-change="handleCurrentChange"
    >
    </el-pagination>

    <el-form :inline="true">



      <el-form-item>
        <el-button type="primary" @click="ReceiveAllText" style="background-color: green; border-color: green;">一键领取</el-button>
      </el-form-item>

    </el-form>
    <!--    编辑-->

  </div>
</template>

<script>
import request from "@/utils/request";
import {Message} from "element-ui";
import userManager from "@/UserManager";


export default {
  data() {
    return {
      pageSize: 13,
      pageNum: 1,
      totalCount: 0,
      tableData: [],

      limit: userManager.getPermissions(),
      userId: userManager.getUserId(),

    }
  },

  mounted() {
    this.GetReceiveText();
  },
  methods: {

    GetReceiveText() {

      const GetReceiveTextRequest = {

        pageNum:this.pageNum,
        pageSize:this.pageSize,
        userId:this.userId,
        role:this.limit
      }
      request.post("/GetBook/query", GetReceiveTextRequest)
          .then(res => {
            console.log(res.data);

            this.tableData = res.data.data.list;
            this.totalCount = res.data.data.totalCount;

          })
          .catch(error => {
            console.error("Error fetching data:", error);
          });
    },
    ReceiveText(row) {



      const ReceiveTextRequest = {
        userId:this.userId,
        role:this.limit,
        textbookId:row.textbookId,
        textbookNum:row.textbookNum

      }
      request.post("/GetBook/get", ReceiveTextRequest)
          .then(res => {
            this.GetReceiveText();

          })
          .catch(error => {
            console.error("Error fetching data:", error);
          });
    },

    ReceiveAllText() {
      // 发送 access 请求的逻辑
      let dataList = [];

      this.tableData.forEach(row => {
        if (row.textbookNum) {
          let mapData = {
            textbookId: row.textbookId,
            textbookNum:Number(row.textbookNum)
          };
          dataList.push(mapData);
        }
      });
      const ReceiveAllTextRequest = {
        userId:this.userId,
        role:this.limit,
        teacherMap:dataList,
      }
      request.post("/GetBook/getAll",ReceiveAllTextRequest)  // 假设发送 GET 请求到 /access 接口
          .then(res => {
            console.log("Access request successful:", res.data);
            this.GetReceiveText();
            // 在这里处理返回的数据或者更新组件状态
          })
          .catch(error => {
            console.error("Error sending access request:", error);
          });
    },

    showError(str) {
      // 触发错误提示
      Message.error({
        message: str,
        duration: 3000 // 持续时间为3000毫秒（3秒）
      });
    },









    handleNumberInput(field) {
      this.form[field] = this.form[field].replace(/\D/g, ''); // 只保留数字字符
    },

    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.pageNum = val;
      this.GetReceiveText();
    },


  }
};
</script>
